<!-- 环境质量监测 -->
<template>
  <div>
    <Card :bordered="false">
      <p slot="title">
        环境质量及监测
      </p>
      <Form ref="form" :rules="rules" :model="info">
        <table width='100%' border="1" cellspacing="0" cellpadding="0" ref="print">
          <tr>
            <th colspan="5">
              环境质量及监测情况表
            </th>
          </tr>
          <tr>
            <td colspan="2">
              项目编号
            </td>
            <td colspan="3">
              {{info.Project_number}}
            </td>
          </tr>
          <tr>
            <td width="60" rowspan="5">
              环境质量现状
            </td>
            <td>
              <Icon type="ios-medical" color="#ff6868" />
              引用数据
            </td>
            <td>
              <FormItem prop="Quote_data">
                <RadioGroup v-model="info.Quote_data">
                  <Radio label="apple">
                    <span>是</span>
                  </Radio>
                  <Radio label="android">
                    <span>否</span>
                  </Radio>
                </RadioGroup>
              </FormItem>
            </td>
            <td>
              实际监测
            </td>
            <td>
              <FormItem prop="Actual_monitor">
                <RadioGroup v-model="info.Actual_monitor">
                  <Radio label="是">
                    <span>是</span>
                  </Radio>
                  <Radio label="否">
                    <span>否</span>
                  </Radio>
                </RadioGroup>
              </FormItem>
            </td>
          </tr>
          <tr>
            <td>
              <Icon type="ios-medical" color="#ff6868" />
              <Tooltip placement="right" content="请填写引用的数据来源">
                数据来源
              </Tooltip>
            </td>
            <td>
              <RadioGroup v-model="info.Quote_data_source">
                <Radio label="apple">
                  <span>是</span>
                </Radio>
                <Radio label="android">
                  <span>否</span>
                </Radio>
              </RadioGroup>
            </td>
            <td>
              <Icon type="ios-medical" color="#ff6868" />
              监测方案
            </td>
            <td>
              <FormItem prop="Monitor_plan">
                <UploadFile v-model="info.Monitor_plan" />
              </FormItem>
            </td>
          </tr>
          <tr>
            <td>
              <Icon type="ios-medical" color="#ff6868" />
              引用项
            </td>
            <td>
              <FormItem prop="Quote_item">
                <CheckboxGroup v-model="Quote_item">
                  <Checkbox label="地表水">
                  </Checkbox>
                  <Checkbox label="大气">
                  </Checkbox>
                  <Checkbox label="噪声">
                  </Checkbox>
                  <Checkbox label="地下水">
                  </Checkbox>
                </CheckboxGroup>
              </FormItem>
              <br>
              (可多选)
            </td>
            <td>
              检测项
            </td>
            <td>
              <CheckboxGroup v-model="Test_item">
                <Checkbox label="地表水">
                </Checkbox>
                <Checkbox label="大气">
                </Checkbox>
                <Checkbox label="噪声">
                </Checkbox>
                <Checkbox label="地下水">
                </Checkbox>
              </CheckboxGroup>
              <br>
              (可多选)
            </td>
          </tr>
          <tr>
            <td>
              <Icon type="ios-medical" color="#ff6868" />
              引用报告
            </td>
            <td style="padding:10px">
              <FormItem prop="Quote_report">
                <UploadFile v-model="info.Quote_report" />
              </FormItem>
              <br>
              上传文件格式为docx、doc、PDF、WPS、图
              片、压缩文件
            </td>
            <td>
              <Icon type="ios-medical" color="#ff6868" />
              检测报告
            </td>
            <td style="padding:10px">
              <FormItem prop="Actual_test_report">
                <UploadFile v-model="info.Actual_test_report" />
              </FormItem>
              <br>
              <p>上传文件格式为docx、doc、PDF、WPS、图
                片、压缩文件</p>
            </td>
          </tr>
          <tr>
            <td>
              <Icon type="ios-medical" color="#ff6868" />
              监测点位示意图
            </td>
            <td style="padding:10px">
              <FormItem prop="Monitor_point_map">
                <UploadFile v-model="info.Monitor_point_map" />
              </FormItem>
              <br>
              上传图片格式为JPEG、JPG、PNG、BMP
              <Alert closable type="success" show-icon>某某某.jpg</Alert>
            </td>
            <td>
              <Icon type="ios-medical" color="#ff6868" />
              监测布点图
            </td>
            <td style="padding:10px">
              <FormItem prop="Actual_monitor_point_map">
                <UploadFile v-model="info.Actual_monitor_point_map" />
              </FormItem>
              <br>
              上传图片格式为JPEG、JPG、PNG、BMP
              <Alert closable type="success" show-icon>某某某.jpg</Alert>
            </td>
          </tr>
        </table>
      </Form>
      <Row style="padding:20px 0">
        <Col span="12" style="text">
        <PrintButton v-if="flag" Url="print/printMonitor" :Project_id="info.Id"></PrintButton>
        </Col>
        <Col span="12" style="text-align: right">
        <Button type="primary" @click="submit('save')">
          保存
        </Button>
        <Button type="primary" @click="submit('submit')">
          提交
        </Button>
        </Col>
      </Row>
      <StepBar :status="3" />
    </Card>
  </div>
</template>
<script>
  export default {
    data() {
      return {
        flag: false,
        Quote_item: [],
        Test_item: [],
        info: {},
        rules: {
          Quote_data: {
            required: true,
            trigger: 'change',
            message: '引用数据选项不能为空',
          },
          Quote_data_source: {
            required: true,
            trigger: 'change',
            message: '数据来源选项能为空',
          },
          Monitor_plan: {
            required: true,
            message: '监测方案不能为空',
            trigger: 'blur'
          },
          Quote_report: {
            required: true,
            trigger: 'change',
            message: '引用数据选项不能为空',
          },
          Actual_test_report: {
            required: true,
            trigger: 'change',
            message: '引用数据选项不能为空',
          },
          Monitor_point_map: {
            required: true,
            trigger: 'change',
            message: '引用数据选项不能为空',
          },
          Actual_monitor_point_map: {
            required: true,
            trigger: 'change',
            message: '引用数据选项不能为空',
          },
        }
      }
    },
    created() {
      //判断是否有ID
      if (this.$route.query.Project_id && this.$route.query.Project_id != '') {
        this.getProject(this.$route.query.Project_id)
      } else {
        //跳转首页
        this.$router.push({
          name: "index"
        })
      }
    },
    mounted() {
      console.log(this.info)
    },
    methods: {
      // 保存 save / 提交 submit
      submit(type) {
        // 验证
        this.$refs.form.validate((valid) => {
          if (!valid) {
            return
          }

          let info = this.info

          if (!info.Quote_item || !info.Quote_item.length) {
            this.$Message.error('请选择 引用项');
            return
          }

          info.btn_way = type == 'save' ? 1 : 2
          info.Perject_type = type == 'save' ? 4 : 4
          this.info.Test_item = this.Test_item
          this.info.Quote_item = this.Quote_item
          axios.post('/projectInformation/saveOrUpdateProject', info).then((res) => {
            if (res._STATUS == 1) {
              let title = res._MESSAGE
              if (type == 'save') {
                this.$Modal.success({
                  title,
                })
              } else {

                this.$router.push({
                  name: "reportReview",
                  query: {
                    Project_id: this.$route.query.Project_id,
                  }
                })
              }
            } else {
              // 提示
              this.$Modal.error({
                title,
              })
            }

          })
        })
      },
      /* 获取当前创建项目 */
      getProject(id) {
        axios.get('/projectInformation/findProjectByID', {
          params: {
            id
          }
        }).then(res => {
          this.info = res.info
          localStorage.projectType = this.info.Perject_type
          this.flag = true
        }).catch(err => {
          alert('请求崩溃')
        })
      },
    }
  }
</script>
<style scoped>
</style>